<template>
  <el-dialog
    :title="!dataForm.hid ? '新增' : '修改'"
    :close-on-click-modal="false"
    :visible.sync="visible">
    <el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px">
    <el-form-item label="封面图片" prop="hImg">
      <el-input v-model="dataForm.hImg" placeholder="封面图片"></el-input>
    </el-form-item>
    <el-form-item label="标题" prop="hTitle">
      <el-input v-model="dataForm.hTitle" placeholder="标题"></el-input>
    </el-form-item>
    <el-form-item label="标签" prop="hLabel">
      <el-input v-model="dataForm.hLabel" placeholder="标签"></el-input>
    </el-form-item>
    <el-form-item label="地区" prop="hArea">
      <el-input v-model="dataForm.hArea" placeholder="地区"></el-input>
    </el-form-item>
    <el-form-item label="建筑面积
" prop="hSize">
      <el-input v-model="dataForm.hSize" placeholder="建筑面积
"></el-input>
    </el-form-item>
    <el-form-item label="均价
" prop="hPrice">
      <el-input v-model="dataForm.hPrice" placeholder="均价
"></el-input>
    </el-form-item>
    <el-form-item label="优惠" prop="hPreferential">
      <el-input v-model="dataForm.hPreferential" placeholder="优惠"></el-input>
    </el-form-item>
    <el-form-item label="楼盘优惠
" prop="hPreferentials">
      <el-input v-model="dataForm.hPreferentials" placeholder="楼盘优惠
"></el-input>
    </el-form-item>
    <el-form-item label="售房状态0/在售，1/已销售

" prop="hState">
      <el-input v-model="dataForm.hState" placeholder="售房状态0/在售，1/已销售

"></el-input>
    </el-form-item>
    <el-form-item label="建成时间" prop="hDate">
      <el-input v-model="dataForm.hDate" placeholder="建成时间"></el-input>
    </el-form-item>
    <el-form-item label="在售数量" prop="hNumber">
      <el-input v-model="dataForm.hNumber" placeholder="在售数量"></el-input>
    </el-form-item>
    <el-form-item label="再租数量" prop="hNumbers">
      <el-input v-model="dataForm.hNumbers" placeholder="再租数量"></el-input>
    </el-form-item>
    <el-form-item label="户型" prop="hHouseType">
      <el-input v-model="dataForm.hHouseType" placeholder="户型"></el-input>
    </el-form-item>
    <el-form-item label="总价" prop="tPrices">
      <el-input v-model="dataForm.tPrices" placeholder="总价"></el-input>
    </el-form-item>
    <el-form-item label="装修" prop="tDecoration">
      <el-input v-model="dataForm.tDecoration" placeholder="装修"></el-input>
    </el-form-item>
    <el-form-item label="更新时间" prop="hDates">
      <el-input v-model="dataForm.hDates" placeholder="更新时间"></el-input>
    </el-form-item>
    <el-form-item label="置顶" prop="hTop">
      <el-input v-model="dataForm.hTop" placeholder="置顶"></el-input>
    </el-form-item>
    <el-form-item label="月租金" prop="hMoney">
      <el-input v-model="dataForm.hMoney" placeholder="月租金"></el-input>
    </el-form-item>
    <el-form-item label="总价" prop="hMoneys">
      <el-input v-model="dataForm.hMoneys" placeholder="总价"></el-input>
    </el-form-item>
    <el-form-item label="写字楼类型" prop="hOfficeType">
      <el-input v-model="dataForm.hOfficeType" placeholder="写字楼类型"></el-input>
    </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button @click="visible = false">取消</el-button>
      <el-button type="primary" @click="dataFormSubmit()">确定</el-button>
    </span>
  </el-dialog>
</template>

<script>
  export default {
    data () {
      return {
        visible: false,
        dataForm: {
          hid: 0,
          hImg: '',
          hTitle: '',
          hLabel: '',
          hArea: '',
          hSize: '',
          hPrice: '',
          hPreferential: '',
          hPreferentials: '',
          hState: '',
          hDate: '',
          hNumber: '',
          hNumbers: '',
          hHouseType: '',
          tPrices: '',
          tDecoration: '',
          hDates: '',
          hTop: '',
          hMoney: '',
          hMoneys: '',
          hOfficeType: ''
        },
        dataRule: {
          hImg: [
            { required: true, message: '封面图片不能为空', trigger: 'blur' }
          ],
          hTitle: [
            { required: true, message: '标题不能为空', trigger: 'blur' }
          ],
          hLabel: [
            { required: true, message: '标签不能为空', trigger: 'blur' }
          ],
          hArea: [
            { required: true, message: '地区不能为空', trigger: 'blur' }
          ],
          hSize: [
            { required: true, message: '建筑面积
不能为空', trigger: 'blur' }
          ],
          hPrice: [
            { required: true, message: '均价
不能为空', trigger: 'blur' }
          ],
          hPreferential: [
            { required: true, message: '优惠不能为空', trigger: 'blur' }
          ],
          hPreferentials: [
            { required: true, message: '楼盘优惠
不能为空', trigger: 'blur' }
          ],
          hState: [
            { required: true, message: '售房状态0/在售，1/已销售

不能为空', trigger: 'blur' }
          ],
          hDate: [
            { required: true, message: '建成时间不能为空', trigger: 'blur' }
          ],
          hNumber: [
            { required: true, message: '在售数量不能为空', trigger: 'blur' }
          ],
          hNumbers: [
            { required: true, message: '再租数量不能为空', trigger: 'blur' }
          ],
          hHouseType: [
            { required: true, message: '户型不能为空', trigger: 'blur' }
          ],
          tPrices: [
            { required: true, message: '总价不能为空', trigger: 'blur' }
          ],
          tDecoration: [
            { required: true, message: '装修不能为空', trigger: 'blur' }
          ],
          hDates: [
            { required: true, message: '更新时间不能为空', trigger: 'blur' }
          ],
          hTop: [
            { required: true, message: '置顶不能为空', trigger: 'blur' }
          ],
          hMoney: [
            { required: true, message: '月租金不能为空', trigger: 'blur' }
          ],
          hMoneys: [
            { required: true, message: '总价不能为空', trigger: 'blur' }
          ],
          hOfficeType: [
            { required: true, message: '写字楼类型不能为空', trigger: 'blur' }
          ]
        }
      }
    },
    methods: {
      init (id) {
        this.dataForm.hid = id || 0
        this.visible = true
        this.$nextTick(() => {
          this.$refs['dataForm'].resetFields()
          if (this.dataForm.hid) {
            this.$http({
              url: this.$http.adornUrl(`/house/house/info/${this.dataForm.hid}`),
              method: 'get',
              params: this.$http.adornParams()
            }).then(({data}) => {
              if (data && data.code === 0) {
                this.dataForm.hImg = data.house.hImg
                this.dataForm.hTitle = data.house.hTitle
                this.dataForm.hLabel = data.house.hLabel
                this.dataForm.hArea = data.house.hArea
                this.dataForm.hSize = data.house.hSize
                this.dataForm.hPrice = data.house.hPrice
                this.dataForm.hPreferential = data.house.hPreferential
                this.dataForm.hPreferentials = data.house.hPreferentials
                this.dataForm.hState = data.house.hState
                this.dataForm.hDate = data.house.hDate
                this.dataForm.hNumber = data.house.hNumber
                this.dataForm.hNumbers = data.house.hNumbers
                this.dataForm.hHouseType = data.house.hHouseType
                this.dataForm.tPrices = data.house.tPrices
                this.dataForm.tDecoration = data.house.tDecoration
                this.dataForm.hDates = data.house.hDates
                this.dataForm.hTop = data.house.hTop
                this.dataForm.hMoney = data.house.hMoney
                this.dataForm.hMoneys = data.house.hMoneys
                this.dataForm.hOfficeType = data.house.hOfficeType
              }
            })
          }
        })
      },
      // 表单提交
      dataFormSubmit () {
        this.$refs['dataForm'].validate((valid) => {
          if (valid) {
            this.$http({
              url: this.$http.adornUrl(`/house/house/${!this.dataForm.hid ? 'save' : 'update'}`),
              method: 'post',
              data: this.$http.adornData({
                'hid': this.dataForm.hid || undefined,
                'hImg': this.dataForm.hImg,
                'hTitle': this.dataForm.hTitle,
                'hLabel': this.dataForm.hLabel,
                'hArea': this.dataForm.hArea,
                'hSize': this.dataForm.hSize,
                'hPrice': this.dataForm.hPrice,
                'hPreferential': this.dataForm.hPreferential,
                'hPreferentials': this.dataForm.hPreferentials,
                'hState': this.dataForm.hState,
                'hDate': this.dataForm.hDate,
                'hNumber': this.dataForm.hNumber,
                'hNumbers': this.dataForm.hNumbers,
                'hHouseType': this.dataForm.hHouseType,
                'tPrices': this.dataForm.tPrices,
                'tDecoration': this.dataForm.tDecoration,
                'hDates': this.dataForm.hDates,
                'hTop': this.dataForm.hTop,
                'hMoney': this.dataForm.hMoney,
                'hMoneys': this.dataForm.hMoneys,
                'hOfficeType': this.dataForm.hOfficeType
              })
            }).then(({data}) => {
              if (data && data.code === 0) {
                this.$message({
                  message: '操作成功',
                  type: 'success',
                  duration: 1500,
                  onClose: () => {
                    this.visible = false
                    this.$emit('refreshDataList')
                  }
                })
              } else {
                this.$message.error(data.msg)
              }
            })
          }
        })
      }
    }
  }
</script>
